// 全局css 文件，这里只存变量，其他的样式已改不允许在这里编写
/* Color
-------------------------- */
/// color|1|Brand Color|0
$--color-primary: #384480 !default;
$--color-primary-navbar: #1b65b9 !default;

/// color|1|Background Color|4
$--color-white: #ffffff !default;
/// color|1|Background Color|4
$--color-black: #000000 !default;
$--color-primary-light-1: mix($--color-white, $--color-primary, 10%) !default; /* 53a8ff */
$--color-primary-light-2: mix($--color-white, $--color-primary, 20%) !default; /* 66b1ff */
$--color-primary-light-3: mix($--color-white, $--color-primary, 30%) !default; /* 79bbff */
$--color-primary-light-4: mix($--color-white, $--color-primary, 40%) !default; /* 8cc5ff */
$--color-primary-light-5: mix($--color-white, $--color-primary, 50%) !default; /* a0cfff */
$--color-primary-light-6: mix($--color-white, $--color-primary, 60%) !default; /* b3d8ff */
$--color-primary-light-7: mix($--color-white, $--color-primary, 70%) !default; /* c6e2ff */
$--color-primary-light-8: mix($--color-white, $--color-primary, 80%) !default; /* d9ecff */
$--color-primary-light-9: mix($--color-white, $--color-primary, 90%) !default; /* ecf5ff */
// / color|1|Functional Color|1
$--color-success: #67c23a !default;
/// color|1|Functional Color|1
$--color-warning: #e6a23c !default;
/// color|1|Functional Color|1
$--color-danger: #f56c6c !default;
/// color|1|Functional Color|1
$--color-info: #909399 !default;

$--color-btn-add: #67c23a !default;
$--color-btn-del: #ff7f52 !default;

$--color-btn-del-light: mix($--color-white, $--color-btn-del, 80%) !default;
$--color-btn-add-light: mix($--color-white, $--color-btn-add, 70%) !default;
$--color-success-light: mix($--color-white, $--color-success, 80%) !default;
$--color-warning-light: mix($--color-white, $--color-warning, 80%) !default;
$--color-danger-light: mix($--color-white, $--color-danger, 80%) !default;
$--color-info-light: mix($--color-white, $--color-info, 80%) !default;

$--color-btn-del-lighter: mix($--color-white, $--color-btn-del, 90%) !default;
$--color-btn-add-lighter: mix($--color-white, $--color-btn-add, 90%) !default;
$--color-success-lighter: mix($--color-white, $--color-success, 90%) !default;
$--color-warning-lighter: mix($--color-white, $--color-warning, 90%) !default;
$--color-danger-lighter: mix($--color-white, $--color-danger, 90%) !default;
$--color-info-lighter: mix($--color-white, $--color-info, 90%) !default;
/// color|1|Font Color|2
$--color-text-primary: #636363 !default;
/// color|1|Font Color|2
$--color-text-regular: #1f2d3d !default;
/// color|1|Font Color|2
$--color-text-secondary: #909399 !default;
/// color|1|Font Color|2
$--color-text-placeholder: #c0c4cc !default;
/// color|1|Border Color|3
// $--border-color-base: #DCDFE6 !default;
$--border-color-base: rgba(206, 206, 206, 1) !default;
/// color|1|Border Color|3
$--border-color-light: #dfe4ed !default;
/// color|1|Border Color|3
$--border-color-lighter: #e6ebf5 !default;
/// color|1|Border Color|3
$--border-color-extra-light: #f2f6fc !default;

// Background
/// color|1|Background Color|4
$--background-color-base: #f5f7fa !default;

/* Link
-------------------------- */
$--link-color: $--color-primary-light-2 !default;
$--link-hover-color: $--color-primary !default;

/* Border
-------------------------- */
$--border-width-base: 1px !default;
$--border-style-base: solid !default;
$--border-color-hover: $--color-text-placeholder !default;
$--border-base: $--border-width-base $--border-style-base $--border-color-base !default;
/// borderRadius|1|Radius|0
$--border-radius-base: 3px !default;
$--border-radius-light: 5px !default;
/// borderRadius|1|Radius|0
$--border-radius-small: 2px !default;
/// borderRadius|1|Radius|0
$--border-radius-circle: 100% !default;
/// borderRadius|1|Radius|0
$--border-radius-zero: 0 !default;

// Box-shadow
/// boxShadow|1|Shadow|1
$--box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04) !default;
// boxShadow|1|Shadow|1
$--box-shadow-dark: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.12) !default;
/// boxShadow|1|Shadow|1
$--box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1) !default;

/* Fill
-------------------------- */
$--fill-base: $--color-white !default;

/* Typography
-------------------------- */
$--font-path: 'fonts' !default;
$--font-display: 'auto' !default;
/// fontSize|1|Font Size|0
$--font-size-extra-large: 20px !default;
/// fontSize|1|Font Size|0
$--font-size-large: 18px !default;
/// fontSize|1|Font Size|0
$--font-size-medium: 16px !default;
/// fontSize|1|Font Size|0
$--font-size-base: 13px !default; // 14
/// fontSize|1|Font Size|0
$--font-size-small: 13px !default;
/// fontSize|1|Font Size|0
$--font-size-extra-small: 12px !default;
/// fontWeight|1|Font Weight|1
$--font-weight-primary: 400 !default;
/// fontWeight|1|Font Weight|1
$--font-weight-secondary: 100 !default;
/// fontLineHeight|1|Line Height|2
$--font-line-height-primary: 24px !default;
/// fontLineHeight|1|Line Height|2
$--font-line-height-secondary: 16px !default;
$--font-color-disabled-base: #bbb !default;
/* Size
-------------------------- */
$--size-base: 13px !default;

/* z-index
-------------------------- */
$--index-normal: 1 !default;
$--index-top: 1000 !default;
$--index-popper: 2000 !default;

/* Disable base
-------------------------- */
$--disabled-fill-base: $--background-color-base !default;
$--disabled-color-base: $--color-text-placeholder !default;
$--disabled-border-base: $--border-color-light !default;

// 主颜色变量
// $mainBgColor:                                    #eeeff0; // 主页面背景色
$mainBgColor: #eeeff0; // 主页面背景色
$contentBgColor: #fff; // 正常内容填充背景色
$normalFontColor: #636363; // 正常颜色字体

// 左侧菜单栏
$menuText: rgb(80, 93, 116);
$menuHoverText: #1890ff;
$menuActiveText: #fff;
$subMenuActiveText: #fff; //https://github.com/ElemeFE/element/issues/12951

$menuBg: #eceff4;
$menuHover: #eceff4;
$menuActive: #1890ff;

$subMenuBg: transparent;
$subMenuHover: #a2c9f85b;
$subMenuHeight: 40px;

$subMenuText: #8f9aac;
$subMenuHoverText: #505d74;

// 其他变量
$dialogHeaderBgColor: $--color-primary; // 弹框头部背景色

// 输入框等高度，宽度等变量, 这个是给外面自定义组件使用的，element的修改还是在variables修改
/// fontSize||Font|1
$--input-medium-font-size: 14px !default;
/// height||Other|4
$--input-medium-height: 36px !default;
/// fontSize||Font|1
$--input-small-font-size: 13px !default;
/// height||Other|4
$--input-small-height: 32px !default;
/// fontSize||Font|1
$--input-mini-font-size: 12px !default;
/// height||Other|4
$--input-mini-height: 28px !default;

$inputDefaultPadding: 0 8px; // 默认输入框的内边距

$formItemMarginBottom: 16px; //表单item的下边距
$formItemLableLineHeight: 14px; //表单item label的行高
$tagsViewHeight: 40px; // tag菜单栏高度

$mobileSideBarWidth: 210px; // 移动端sideBar展开宽度  pc端的有拖拽，在setting文件里面控制

// $border:                                       rgba(206, 206, 206, 1);                        // 边框颜色
$text: $--color-text-primary; // 文字颜色

// 表格样式
$table-header-bg: #f0f2f5; // 表头底色
$table-header-height: 44px; // 表头高度
$table-border: #cecece; // 表格整体边框颜色
$table-border-row: #dfe4ed99; // 表格下边框颜色
$table-header-color: #101010; // 表头文字颜色
$table-header-weight: 700; // 表头是否加粗
$table-body-height: 40px; // 表格列高度

// 分页样式
$pagination-width: 20px; // 分页按钮的大小
$pagination-radius: 2px; // 分页按钮的圆角
$pagination-color: $text; // 分页按钮文字的颜色
$pagination-space: 6px; // 分页按钮之前的间距
$pagination-sizes-width: 100px; // 分页下拉选项的宽度

// 表单样式
$input-height: 32px; // 输入框的高度
$input-color: $text; // 输入框字体颜色
$input-focus-color: $--color-primary; // 输入框获取焦点后边框的颜色
$form-item-bottom: 16px; // 输入框的上下间隔
$form-label-right: 10px; // 文字到输入框的距离
$placeholder-color: #909399; // 输入框提示文字颜色
$error-bg: transparent; // 错误提示背景
// $error-text-color:                             #BB809C;                                       // 错误提示文字颜色
$error-text-color: #ff7f52; // 错误提示文字颜色
$radio-color: $--color-primary;
$checkbox-color: $--color-primary;
$switch-color: $--color-primary;

// 弹窗样式
$dialog-header-height: 36px; // 弹窗头部的高度
$dialog-header-size: 16px; // 弹窗头部标题的大小
$dialog-header-btn-size: 20px; // 弹窗头部按钮的大小
$dialog-header-color: #fff; // 弹窗头部文字的颜色
$dialog-header-bg: $--color-primary-navbar; // 弹窗头部的背景色
$dialog-space: 5px; // 弹窗的内容区域和底部的内边距
$dialog-space-tb: 5px; // 弹窗的头部上下边距
$dialog-space-fr: 5px; // 弹窗的头部左右边距
$dialog-header-bottom-border: 1px solid #e7e7e7; // 弹框头部底线
$dislog-border-radius: 8px; // 弹框边框圆角

$dialogHeaderBg: #505d74;
$--dialog-radius: 8px !default;
$--dialog-padding: 12px 20px !default;
$--dialog-min-height: 280px !default;
$--dialog-max-height: calc(100vh - 300px) !default;
$--el-dialog-margin-top: 10vh !default;

$--drawer-padding: 5px 12px !default;
:export {
  menuText: $menuText;
  menuActiveText: $menuActiveText;
  subMenuActiveText: $subMenuActiveText;
  menuBg: $menuBg;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuHover: $subMenuHover;
  mobileSideBarWidth: $mobileSideBarWidth;
  colorPrimary: $--color-primary;
  colorSuccess: $--color-success;
  colorWarning: $--color-warning;
  colorDanger: $--color-danger;
}
